<script setup lang="ts">
import { editPassword } from '@/api/user';
import { ref } from 'vue';

const userInfo = defineProps({
    id: String
})
const dialogVisible = defineModel('dialogVisible')
const password = ref('')

const submit = () => {
    if (userInfo.id != undefined) {
        dialogVisible.value = false;
        editPassword(userInfo.id, password.value);
    }
}

</script>

<template>
    <div class="password">
        <el-dialog
            v-model="dialogVisible"
            title="修改密码"
            width="500"
        >
            <div>
                <el-text class="mx-1">请输入新密码</el-text>
                <el-input v-model="password" type="password" style="width: 240px; padding-left: 3%;" placeholder="Please Password" />
            </div>
            <template #footer>
            <div class="dialog-footer">
                <el-button @click="dialogVisible = false">取消</el-button>
                <el-button type="primary" @click="submit()">确认</el-button>
            </div>
            </template>
        </el-dialog>
    </div>
</template>

<style lang="scss" scoped>
</style>